<template>
    <view class="content">
		<view class="con_header">
			<view class="header-title"><image class="img" src="../../static/img/pandian.png"></image> 物流管理平台</view>
		</view>
		<view class="con_conter">
			<view class="li" v-for="(item,index) in button_list" :key="index" @tap="navigateTo(item.navigate_to_url)">
				<view class="iconfont" :class="item.imag_url"></view>
				<view class="li-text">{{item.text}}</view>
			</view>
		</view>
		
		<view class="con_conter2">
			<view class="li" v-for="(item,index) in button_list2" :key="index" @tap="navigateTo(item.navigate_to_url)">
				<view class="iconfont" :class="item.imag_url"></view>
				<view class="li-text">{{item.text}}</view>
			</view>
		</view>
		
		<!-- <view class="con_conter">
			<view class="my_ul_button" v-for="(item,index) in button_list" :key="index" @tap="navigateTo(item.navigate_to_url)">
				<view class="my_ul_button_left"><image class="images" :src="item.imag_url" /></view>
				<view class="my_ul_button_right">{{item.text}}</view>
			</view>
		</view> -->
		<!-- 侧边导航 -->
		<uni-drawer :visible="rightDrawerVisible" mode="right" @close="closeRightDrawer">
			<view class="drawer-content" >
				<view class="user_info">
					<view class="info_img">
						<image src="../../static/img/qq.png"></image>
					</view>
					<view class="userName_warp">
						<text class="userName">李钊</text>
					</view>
					<view class="uni-uploader__input-box" style="position: absolute;top: 10px;left: 0;right: 0;margin: auto;opacity: 0; width: 80px;height: 80px;border-radius: 50%;">
						<view class="uni-uploader__input" @tap="chooseImage"></view>
					</view>
				</view>
				<view class="uni-list" >
					<view class="uni-list-cell" hover-class="uni-list-cell-hover">
						<view class="uni-list-cell-navigate uni-navigate-right" @tap="setUp">
							<view class="together">
								<view class="iconfont icon-shezhi"></view>
								设置	
							</view>
						</view>
					</view>
					<view class="uni-list-cell" hover-class="uni-list-cell-hover">
						<view class="uni-list-cell-navigate uni-navigate-right" @tap="bindLogout">
							<view class="together">
								<view class="iconfont icon-tuichu-"></view>
								退出账号	
							</view>
							
						</view>
					</view>
				</view>
			</view>
		</uni-drawer>
    </view>
</template>

<script>
    import {
        mapState
    } from 'vuex'
	import uniDrawer from '../../components/uni-drawer.vue';//侧边导航
    export default {
        computed: mapState(['forcedLogin', 'hasLogin', 'userName']),
		components: {
			uniDrawer,
		},
		data(){
			return{
				button_list:[{
					imag_url:'icon-icozhuanhuan',
					text:'采购收货',
					navigate_to_url:'../purchase_page/purchase_page'
				},{
					imag_url:'icon-icon-test',
					text:'生产入库',
					navigate_to_url:'../production_page/production_page'
				},{
					imag_url:'icon-rukuguanli',
					text:'其他入库',
					navigate_to_url:'../other_warehousing_page/other_warehousing_page'
				},{
					imag_url:'icon-iconfontzhizuobiaozhunbduan31',
					text:'入库上架',
					navigate_to_url:'../confirmation_page/confirmation_page'
				},{
					imag_url:'icon-iconfontzhizuobiaozhunbduan30',
					text:'拣配下架',
					navigate_to_url:'../picking_page/picking_page'
				},{
					imag_url:'icon-yuchuku',
					text:'领料出库',
					navigate_to_url:'../collection_Materials_page/collection_Materials_page'
				},{
					imag_url:'icon-chukuliucheng',
					text:'销售出库',
					navigate_to_url:'../sales_outlet_page/sales_outlet_page'
				},{
					imag_url:'icon-wuliaocaigou',
					text:'移仓出库',
					navigate_to_url:'../shiftOutWarehouse_page/shiftOutWarehouse_page'
				},{
					imag_url:'icon-zhijiandan',
					text:'质检解冻',
					navigate_to_url:'../qualityTesting_page/qualityTesting_page'
				},{
					imag_url:'icon-plus-transfer',
					text:'仓位转移',
					navigate_to_url:'../transferPositions_page/transferPositions_page'
				},{
					imag_url:'icon-tuopantray17',
					text:'托盘组合',
					navigate_to_url:'../palletCombination_page/palletCombination_page'
				},{
					imag_url:'icon-navicon-kcpd',
					text:'盘点',
					navigate_to_url:'../Inventory_page/Inventory_page'
				}],
				button_list2:[{
					imag_url:'icon-zijinchiguanxidongjiejiedong',
					text:'仓位库存',
					navigate_to_url:'../warehouseInventory_page/warehouseInventory_page'
				},{
					imag_url:'icon-wuliaocaigou',
					text:'物料库存',
					navigate_to_url:'../warehouseInventory_page/warehouseInventory_page'
				},{
					imag_url:'icon-gongzuozheng',
					text:'工作任务',
					navigate_to_url:''
				}],
				rightDrawerVisible: false,//侧边栏
				user_img:'',//用户头像
			}
		},
		//侧边栏
		onNavigationBarButtonTap(e) {
			this.rightDrawerVisible = !this.rightDrawerVisible
		},
        onLoad() {
            uni.getStorage({
            	key:'token',
				success: function (res) {
					console.log(res.data);
					if(!res.data){
						uni.showModal({
							title: '提示',
							content: '您还没有登录请前去登录！',
							showCancel:false,
							success: function (res) {
								uni.reLaunch({
									url:'../login/login'
								})
							}
						});
					}
				},
				fail:function(error) {
					console.log(error)
					uni.showModal({
						title: '提示',
						content: '您还没有登录请前去登录！',
						showCancel:false,
						success: function (res) {
							uni.reLaunch({
								url:'../login/login'
							})
						}
					});
				}
            })
        },
		methods:{
			//跳转
			navigateTo(url){
				uni.navigateTo({url: url,});
			},
			//关闭侧边栏
			closeRightDrawer() {
				this.rightDrawerVisible = false;
			},
			//设置
			setUp() {
				uni.navigateTo({
					url:'../set_up/set_up'
				})
			},
			//退出账号
			bindLogout() {
				uni.showModal({
					title: '提示',
					content: '是否退出账号',
					success: function (res) {
						if (res.confirm) {
							uni.setStorage({
								key: 'token',
								data:''
							})
							uni.reLaunch({
								url: '../login/login',
							});
						} else if (res.cancel) {
						}
					}
				});
			},
			//选择图片用户头像
			chooseImage(){
				let that =this
				uni.chooseImage({
					sizeType: ['original','compressed'], //可以指定是原图还是压缩图，默认二者都有
					count: 1,//默认9
					success: (rem) => {
						const tempFilePaths = rem.tempFilePaths;
						that.user_img=tempFilePaths[0]
// 						uni.showLoading({
// 							title: '头像上传中...'
// 						});
// 						uni.uploadFile({
// 							url: that.GLOBAL.host_svr+'/user/modifyUserImg', 
// 							filePath: tempFilePaths[0],
// 							name: 'file',
// 							formData: {
// 								'token': that.token
// 							},
// 							success: (uploadFileRes) => {
// 								console.log(uploadFileRes.data);
// 								uni.showToast({
// 									title: '修改头像成功',
// 									duration: 2000
// 								});
// 								uni.hideLoading();
// 								//更新头像
// 								that.get_user_img()
// 							}
// 						});
					}
				})
			},
		},
    }
</script>

<style scoped="scoped" lang="scss">
	@import "./main.scss";
</style>
